<template>
	<view class="message-wrap">
		<view class="u-text-center">
			<u-grid @click="jump" :col="3" :border="false">
				<!--点赞消息-->
				<u-grid-item index="/newpages/social/message-like-list">
					<navigator class="grid-topic">
						<u-badge :count="likenum" :offset="[30, 30]"></u-badge>
						<u-icon name="heart" size="60"></u-icon>
						<view class="heart">点赞</view>
					</navigator>
				</u-grid-item>
				<!--关注消息-->
				<u-grid-item index="/newpages/social/message-follow-list">
					<navigator class="grid-topic">
						<u-badge :count="follownum" :offset="[30, 30]"></u-badge>
						<u-icon name="man-add" size="60"></u-icon>
						<view class="man-add">关注</view>
					</navigator>
				</u-grid-item>
				<!--评论消息-->
				<u-grid-item index="/newpages/social/message-comment-list">
					<navigator class="grid-topic">
						<u-badge :count="commentnum" :offset="[30, 30]"></u-badge>
						<u-icon name="chat" size="60"></u-icon>
						<view class="chat">评论</view>
					</navigator>
				</u-grid-item>
			</u-grid>
		</view>
		<!--官方消息列表-->
		<view class="notice-title u-p-30 u-tips-color">果糖私信消息...</view>
		<view  v-for="(item, index) in noticeList" :key="index">
			<view class="notice-item u-p-30">
				<view class="user-info u-flex">
					<u-avatar size="mini"></u-avatar>
					<view class="u-flex u-m-l-15">
						<view class="u-m-r-15">果糖助手</view>
						<u-tag text="官方" mode="dark" size="mini"></u-tag>
					</view>
				</view>
				<view class="notice-content">{{item.content}}</view>
			</view>
			
		</view>
		<u-loadmore v-if="noticeList.length" height="80rpx" :status="loadStatus" icon-type="flower"
			color="#ccc" />
	</view>
</template>

<script>
	import Config from '../../common/js/config.js'
	import globalConfig from '@/common/js/golbalConfig.js';
	export default {
		data() {
			return {
               member_id:'' ,//当前登录用户ID
			   commentnum:'',
			   likenum:'',
			   follownum:'',
			   noticeList:[],
			   lastPage: 1,
			   currentPage: 1,
			   status: 'loadmore',
			   showEmpty: false,
			}
		},
		onShow() {
			// 刷新多语言
			this.$langConfig.refresh();
		},
		onLoad() {
			this.getNum();
			this.getNoticelist();
			//登录后查询
			if (uni.getStorageSync('userInfo')) {
				this.member_id = uni.getStorageSync('userInfo').member_id
			}
		},
		onReachBottom() {

		},
		mixins: [globalConfig],
		methods: {
			//获取相关数据统计
			getNum() {
				this.showEmpty = false;
				this.$api.sendRequest({
					url: '/social/api/message/num',
					data: {
						member_id : uni.getStorageSync('userInfo').member_id
					},
					success: res => {
						this.showEmpty = true;
						if (res.code == 0) {
							this.commentnum = res.commentnum,
							this.likenum = res.likenum,
							this.follownum = res.follownum
							
						} else {
							this.$util.showToast({
								title: res.message
							});
						}
					},
					fail: res => {
						mescroll.endErr();
						if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
					}
				});
			},
			//官方消息
			getNoticelist() {
				this.showEmpty = false;
				this.$api.sendRequest({
					url: '/social/api/message/notice',
					data: {
						member_id : uni.getStorageSync('userInfo').member_id
					},
					success: res => {
						this.showEmpty = true;
						if (res.code == 0) {
						   this.noticeList = [...this.noticeList, ...res.data.data];
						   this.isEmpty = !this.noticeList.length;
						   this.lastPage = res.data.last_page;
						   this.loadStatus = this.currentPage < res.data.last_page ? 'loadmore' : 'nomore';
						} else {
							this.$util.showToast({
								title: res.message
							});
						}
					},
					fail: res => {
						mescroll.endErr();
						if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
					}
				});
			},
			//宫格跳转
			jump(url) {
				uni.navigateTo({
					url: url
				})
			},

		}
	}
</script>

<style>
	.message-wrap {
		background-color: #FFFFFF;
		height: 100vh;
	}
</style>
